
import Vue from 'vue'
import Vuex from 'vuex'
import storage from '../model/Storage.js'
import { baseRoutes, dynamicRrouter } from '../router/index.js'
import { getDyMenuRouter } from '../api/Menu.js'
import { cloneDeep } from 'lodash'
import { serviceTest } from '../utils/menuRule.js'

Vue.use(Vuex)
// 用Vuex.Store对象用来记录token
const store = new Vuex.Store({
  state: {
    // 存储token
    token: '',
    userName: '', // 可选
    currentPathName: '',
    // 定义动态路由导航
    dyRouter: [],
    sidebar: []

  },

  getters: {
    getToken (state) {
      return state.token || '';
    },
    getDyRouter (state) {
      return state.dyRouter || '';
    },
    getSidebar (state) {
      return state.sidebar || '';
    }
  },

  mutations: {
    // 修改token，并将token存入localStorage
    setToken (state, token) {
      state.token = token;
      storage.set('token', token);
      console.log('store、localstorage保存token成功!', token);
    },
    delToken (state) {
      this.token = '';
      this.userName = ''; // 可选
      this.currentPathName = '';
      // 定义动态路由导航
      this.dyRouter = [];
      this.sidebar = [];
      storage.remove('token');
      storage.remove('userName');
      storage.remove('dyRouter');
      storage.remove('sidebar');
      storage.remove('currentPathName');
      console.log('store、localstorage删除成功!');
    },
    // 可选
    setUserInfo (state, userName) {
      state.userName = userName;
      storage.set('userName', userName);
    },
    // 设置动态路由
    setDyRouter (state, dyRouter) {
      state.dyRouter = dyRouter
      storage.set('dyRouter', dyRouter);
    },
    // 设置菜单导航
    setSidebar (state, sidebar) {
      state.sidebar = sidebar
      storage.set('sidebar', sidebar);
    },
    // 删除菜单导航
    removeDyRouter (state) {
      state.dyRouter = [];
      storage.remove('dyRouter');
    },
    // 保存当前路由名称
    setCurrentName (state, currentPathName) {
      state.currentPathName = currentPathName
      storage.set('currentPathName', currentPathName);
    }

  },

  actions: {
    getMenu ({ commit, state }) {
      return new Promise((resolve, reject) => {
        console.log('用户信息', storage.get('userName'));
        getDyMenuRouter(storage.get('userName')).then(res => {
          // console.log('接口获取的路由列表', res.backgroundRouter);
          // console.log('接口获取侧边栏', res.sidebar);
          // const sdata = JSON.parse(JSON.stringify(res.data))
          // console.log('处理后接口的路由列表', res.data);
          // console.log('前端配置的路由列表为', dynamicRrouter);
          const menuArr = serviceTest(dynamicRrouter, res.backgroundRouter);
          // console.log('处理后的路由列表为', menuArr);
          const myBaseRoutes = cloneDeep(baseRoutes);
          myBaseRoutes[0].children.push(...menuArr);
          // console.log('myBaseRoutes', myBaseRoutes[0]);
          commit('setDyRouter', myBaseRoutes);
          commit('setSidebar', res.sidebar);
          resolve(myBaseRoutes);
        }).catch((e) =>
          console.log('接口获取菜单列表异常!', reject(e))
        )
      })
    }
  }
});

export default store;
